<!-- #cartoon:tab2  Author:liuricheng   Time:2013-08-29 -->

<div style="height:400px;height:auto;min-height:400px;">
   	<table border="1" class="t1" width="100%">
  		<tr>
			<th>
				{$lang.cartoon_main_picture}
			</th>
			<td>
				<span>							
					<div id="button1" class="button">Upload</div>	
				</span>
				<span>
					<input id="original_img"  type="hidden" name="original_img" value=""/>
					<input id="thumb_img"  type="hidden" name="thumb_img" value=""/>
					<img id="img1" style="display:none; width:220px;height:166px;" src=""/>
					<span>
						<a id="delimg1" href="javascript:FileController.deleteImg('original_img','thumb_img');" class="hide">{$lang.delete}</a>
					</span>
				</span>
			</td>
		</tr>
			<th>
				{$lang.cartoon_vice_picture}
			</th>
			<td>
				<span>							
					<div id="button2" class="button">Upload</div>	
				</span>
				<span>
					<input id="other_img"  type="hidden" name="other_img" value=""/>
					<input id="other_thumb_img"  type="hidden" name="other_thumb_img" value=""/>
					<img id="img2" style="display:none;width:160px;height:120px;" src=""/>
					<span>
						<a id="delimg2" href="javascript:FileController.deleteImg('other_img','other_thumb_img');" class="hide">{$lang.delete}</a>
					</span>
				</span>
			</td>
		</tr>
		<tr>
			<th>
				{$lang.cartoon_phone_picture}
			</th>
			<td>
				<span>							
					<div id="button3" class="button">Upload</div>	
				</span>
				<span>
					<input id="phone_img"  type="hidden" name="phone_img" value=""/>
					<img id="img3" style="display:none; width:100px; height:100px;" src=""/>
					<span>
						<a id="delimg3" href="javascript:FileController.deleteOneImg('phone_img');" class="hide">{$lang.delete}</a>
					</span>
				</span>
			</td>
		</tr>    	   		
   	</table>
</div>

<script>

	$(document).ready(function(){
		var URI         =   "/tingting/Public/Upload/images/"; 
		var button      =   $('#button1'), interval;
		
		new AjaxUpload(button, {
			action: '__APP__/Course/uploadImg', 
			name: 'userfile',
			onSubmit : function(file, ext){
				// change button text, when user selects file			
				button.text('Uploading');
				this.disable();				
				// Uploding -> Uploading. -> Uploading...
				interval = window.setInterval(function(){
					var text = button.text();
					if (text.length < 13){
						button.text(text + '.');					
					} else {
						button.text('Uploading');				
					}
				}, 200);
			},
			onComplete: function(file, response){
				button.text('Upload');				
				//set values
				var img             =   document.getElementById("original_img");
				var thum_img        =   document.getElementById("thumb_img");
				var img_1           =   document.getElementById("img1");
				var valueArr        =   response.split(","); //split string  
				img.value           =   valueArr[0];
				img_1.src           =   URI + img.value;//将照片地址赋给img元素
				img_1.style.display =   "block";
				thum_img.value      =   valueArr[1];
				//show action delete
				var delimg1         =   document.getElementById("delimg1");
				delimg1.style.display = "block";
				// clear 定时器
				window.clearInterval(interval);
				// enable upload button
				this.enable();						
			}
		});		
		
		var button2 = $('#button2'),interval;
		
		new AjaxUpload(button2, {
			action: '__APP__/Course/uploadImg', 
			name: 'otherfile',
			onSubmit : function(file, ext){		
				button2.text('Uploading');
				this.disable();				
				//Uploding -> Uploading. -> Uploading...
				interval = window.setInterval(function(){
					var text = button.text();
					if (text.length < 13){
						button2.text(text + '.');					
					} else {
						button2.text('Uploading');				
					}
				}, 200);
			},
			onComplete: function(file, response){
				button2.text('Upload');	
				this.disable();
				//获取值
				var other_img         =   document.getElementById("other_img");
				var other_thumb_img   =   document.getElementById("other_thumb_img");
				var valueArr          =   response.split(",");//字符分割   
				other_img.value       =   valueArr[0];
				other_thumb_img.value =   valueArr[1];
				//显示图片
				var img_2           =   document.getElementById("img2");
				img_2.src           =   URI + other_img.value;//将照片地址赋给img元素
				img_2.style.display =   "block";
				//显示删除按钮
				//show action delete
				var delimg2         =   document.getElementById("delimg2");
				delimg2.style.display = "block";
				//clear 定时器
				window.clearInterval(interval);
				//enable upload button
				this.enable();									
			}
		});	
		
		
		var button3 = $('#button3'),interval;
		
		new AjaxUpload(button3, {
			action: '__APP__/Cartoon/uploadPhoneImg', 
			name: 'otherfile',
			onSubmit : function(file, ext){		
				button3.text('Uploading');
				this.disable();				
				//Uploding -> Uploading. -> Uploading...
				interval = window.setInterval(function(){
					var text = button.text();
					if (text.length < 13){
						button3.text(text + '.');					
					} else {
						button3.text('Uploading');				
					}
				}, 200);
			},
			onComplete: function(file, response){
				button3.text('Upload');	
				this.disable();
				//页面操作
				var phone_img         =   document.getElementById("phone_img");//获取 值
				var img_3             =   document.getElementById("img3");//显示图片
				var delimg3           =   document.getElementById("delimg3");//显示删除按钮
				phone_img.value       =   response;
				img_3.src             =   URI + phone_img.value;//将照片地址赋给img元素
				img_3.style.display   =   "block";
				delimg3.style.display = "block";
				//clear 定时器
				window.clearInterval(interval);
				//enable upload button
				this.enable();									
			}
		});	

	});
</script>


